<html> 
<head><link type="text/css" href="../note.css" rel="stylesheet"/><script type="text/javascript" src="../note.js"/>
  <title>WebWidgets | Note Widget</title>
</head>
<body>
<h1>Note Widget</h1>
<p>The note widget lets you embed small notes into your WW
pages. These notes look small until clicked on, when they expand. To
get a feeling for this, try clicking on this note:

<span id="ww_note1" class="ww_note"><span onclick="ww_note_toggle(&apos;ww_note1&apos;)" id="ww_note1_small" class="ww_note_small">Click me</span><span id="ww_note1_full" class="ww_note_full">
    You&apos;re clicked on the note. That&apos;s good. This is the full
    text of the note, and you can make it go away any time you want
    just by clicking on the part that says &apos;Click me&apos;.
    <p>The contents of notes is normal HTML, so you can use
       <b>formatting</b> and such.

       <span id="ww_note2" class="ww_note"><span onclick="ww_note_toggle(&apos;ww_note2&apos;)" id="ww_note2_small" class="ww_note_small">Note</span><span id="ww_note2_full" class="ww_note_full">You can even nest notes.</span></span>
    </p>
  </span></span></p>

<p>As you can see, notes are displayed inline when they&apos;re in their
small form and displayed as block when they&apos;re expanded.</p>

<h2>Example</h2>
<p>The example above requires this code in the WW source file:</p>

<pre>

&lt;note&gt;
  &lt;small&gt;Click me&lt;/small&gt;
  &lt;full&gt;
    You&apos;re clicked on the note. That&apos;s good. This is the full
    text of the note, and you can make it go away any time you want
    just by clicking on the part that says &apos;Click me&apos;.
    &lt;p&gt;The contents of notes is normal HTML, so you can use
       &lt;b&gt;formatting&lt;/b&gt; and such.

       &lt;note&gt;&lt;small&gt;Note&lt;/small&gt;
         &lt;full&gt;You can even nest notes.&lt;/full&gt;
       &lt;/note&gt;
    &lt;/p&gt;
  &lt;/full&gt;
&lt;/note&gt;

</pre>

<p>The <tt>&lt;note&gt;</tt> tag can specify an <tt>id</tt> attribute,
or it can have one automatically generated for it in the <tt>ww_</tt>
namespace. The <tt>&lt;note&gt;</tt> tag has two children,
<tt>&lt;small&gt;</tt> and <tt>&lt;full&gt;</tt>. The
<tt>&lt;small&gt;</tt> tag contains the short description or a small
picture (or whatever you want to appear when the note is unexpanded),
and can be omitted. If it is omitted, the word &quot;Note&quot; is used
instead. The <tt>&lt;full&gt;</tt> tag contains the full, expanded
contents of the note.</p>

</body>
</html>